<template>
    
    <div style="padding-top: 15px;">
        <div style="text-align: center;"><van-loading v-if="load" size="24px"><span style="padding: 10px 0">加载中...</span></van-loading></div>
        <div class="goods" v-for="(item,index) in goods" :key="index" @click="$emit('getDetail',item ,type)" >
        <div class="goods-image index-goods-image" >
            <img v-lazy="item.avatar">
             </div>
            <div class="goods-info">
                <p class="title">{{ item.title }}</p>
                <p class="money" v-if="item.price">¥ {{ item.price }}</p>
            </div>
        </div>
        <div class="data_null" v-if="load == false && goods.length == 0">
            数据为空
        </div>
    </div>
</template>
<script>
export default {
    name:"indexGoods",
    props: {
        goods: Array,
        type:Number,
        load: Boolean
    },
    data(){
        return {
            is_dataNull: true
        }
    },
    created(){
        this.is_data();
    },
    methods: {
        is_data(){
            if(this.goods){
                this.is_dataNull = false
            }else {
                this.is_dataNull = true
            }
        }
    }
}
</script>
<style>
.goods {
    display: inline-block;
    width: 50%;
}
.goods .goods-image {
    width: 175px;
    height: 175px;
    margin: 0 auto;
}
.goods .goods-image img {
    width: 100%;
    height: 100%;
}
.goods-info .title {
    font-size: 14px;
    text-overflow:ellipsis;
    white-space: nowrap;
    overflow: hidden;
}
.goods-info .money {
    color: #e93b3d;
}
</style>